<template>
	<view class="withDraw">
		<!-- <uni-nav-bar title="申请提现" left-icon="left" @clickLeft="navBack" backgroundColor="#2CB9A4" color="#F8F8F8"></uni-nav-bar> -->
		<view class="withContent">
			<view class="item">
				<view class="">
					待提现佣金
				</view>
				<view class="jeNum">
					￥{{money}}
				</view>
			</view>
			<view class="item">
				<view class="">
					提现方式
				</view>
				<view class="">
					微信钱包
				</view>
			</view>
			<view class="txje item">
				<view class="u-demo-block">
					<text class="u-demo-block__title">提现金额:</text>
					<view class="u-demo-block__content">
						<u--input placeholder="请输入内容" border="surround" v-model="price" @change="change"></u--input>
					</view>
				</view>
			</view>
			<view class="txje item">
				<view class="u-demo-block">
					<text class="u-demo-block__title">支付宝账号:</text>
					<view class="u-demo-block__content">
						<u--input placeholder="请输入内容" border="surround" v-model="alipayAccount"
							@change="change"></u--input>
					</view>
				</view>
			</view>
			<view class="botBtn">
				<view style="width: 100%;">
					<u-button class="custom-style" text="提现"
						customStyle="background: linear-gradient(90deg, #2CB9A4 0%, #2CB9A4 100%);color:#fff;margin-top:20px;border-radius: 30px;"
						@click="goAuth">
					</u-button>
				</view>
			</view>
			<view class="money">
				提现说明：当日最高提现金额：{{config.highest_money}}元,最低提现金额{{config.minimum_money}}元,提现手续费：{{config.commission}}%
			</view>
			<view class="botBtn2" v-if="isNotWx&&is_wx==0">
				<view style="width: 100%;">
					<u-button class="infoCopy" text="复制微信链接"
						customStyle="background: linear-gradient(90deg, #2CB9A4 0%, #2CB9A4 100%);color:#fff;margin-top:20px;border-radius: 30px;"
						>
					</u-button>
				</view>
			</view>
		</view>
		<view class="confirmCop">
			<u-modal :show="showCop" @confirm="confirmCop" title="提示" ref="uModal" :content="content"
				:showCancelButton="true" confirmColor="rgb(44, 185, 164)" @cancel="showCop = false" @close="showCop = false" :closeOnClickOverlay="true">
				<!-- <view class="infoCopy">
					<u-button slot="confirmButton" text="确定" type="success" shape="circle" @click="confirmCop"
						class=""></u-button>
				</view> -->
			</u-modal>
		</view>
		<u-toast ref="uToast"></u-toast>
		<m-tabbar native>
		</m-tabbar>
	</view>
</template>

<script>
	const clipboardText =
		"https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=Mzg5MDk0NjQ2Mw==#wechat_redirect";
	const copyText1 = () => {
		const clipboard = new ClipboardJS(".infoCopy", {
			text() {
				return clipboardText;
			},
		});
		clipboard.on("success", () => {
			uni.showToast({
				title: '已复制链接到剪切板',
				icon: "none"
			})
			// showToast('已复制链接到剪切板')
		});
		clipboard.on("error", () => {
			console.log("复制失败");
		});
	};

	import ClipboardJS from "clipboard"
	import {
		initiate,
		getConfig,
		getMoney,
		getMerchant,
		getOpenid
	} from '@/request/api.js'
	import {
		isWxBrowser,
		resolveBlob,
		getCode,
		copyText
	} from "@/utils/uploadFun.js";
	export default {
		data() {
			return {
				config: null,
				content: '复制链接，去微信打开公众号操作！',
				price: '',
				money: 0,
				is_wx: 0, //默认是没有绑定微信的
				showCop: false,
				isNotWx:true,//默认不是微信环境
			};
		},
		onShow() {
			this.getConfig()
			this.getMoney()
			this.getMerchant()
		},
		mounted() {
			copyText1();
		},
		onHide() {
			this.price = ''
		},
		methods: {
			copyText1() {
				const clipboard = new ClipboardJS(".infoCopy", {
					text() {
						return clipboardText;
					},
				});
				clipboard.on("success", () => {
					uni.showToast({
						title: '已复制链接到剪切板',
						icon: "none"
					})
					this.showCop =  false;
					// showToast('已复制链接到剪切板')
				});
				clipboard.on("error", () => {
					console.log("复制失败");
				});
			},
			async getMerchant() {
				let res = await getMerchant()
				this.is_wx = res.data.is_wx
				this.getwxInfo()
				console.log(this.is_wx, 'getMerchant')
			},
			confirmCop() {
				this.showCop = false;
			},
			async getwxInfo() {
				if (this.is_wx) return false;
				if (this.is_wx == 0 && !this.is_wx) { //未绑定的时候
					let data = getCode()
					console.log(data,'getCode')
					if (!data.isWx) { //不是微信环境
						this.showCop = true;
						this.isNotWx =  true;
					} else { //是微信环境
						//
						this.showCop = false;
						this.isNotWx =  false;
						console.log(data.code,'code111')
						if (data.code) { //存在code的时候此时要绑定微信用户
							let res = await getOpenid({
								code: data.code
							})
							//成功之后再回调一次
							console.log(res, '绑定微信openid的状态')
							if (res.code === 200) { //此时一般都是code失效
								this.is_wx = 1
								const urlParams = new URL(window.location.href); //将字符串变成url对象
								let url = urlParams.origin + urlParams.pathname + '/#/pages/withdraw/withdraw'
								location.href = url
							}
							if (res.msg == 'code失效') { //此时一般都是code失效
								const urlParams = new URL(window.location.href); //将字符串变成url对象
								let url = urlParams.origin + urlParams.pathname + '/#/withdraw'
								location.href = url
							}

						}
					}
					console.log('微信未绑定')
				} else {
					console.log('已绑定')

				}
			},
			async getMoney() {
				let res = await getMoney()
				this.money = res.data
				// console.log(res,'money')
			},
			async goAuth() {
				let price = this.amountCer(this.price)
				if (!price) {
					this.$refs.uToast.show({
						message: '提现只能输入数字且最多输入两位小数',
						type: 'error',
						duration: 1500
					})
					return
				}
				let getPrice = Number(this.price)
				// console.log(Number(this.config.minimum_money),'最小金额')
				if (getPrice < Number(this.config.minimum_money)) {
					this.$refs.uToast.show({
						message: '提现金额必须大于最小提现额',
						type: 'error',
						duration: 1500
					})
					return
				}
				// console.log(this.config.highest_money,'最大金额')
				if (getPrice > Number(this.config.highest_money)) {
					this.$refs.uToast.show({
						message: '提现金额必须小于最高提现额',
						type: 'error',
						duration: 1500
					})
					return
				}
				let form = {
					type_data: 0,
					alipayAccount: this.alipayAccount,
					price: getPrice
				}
				console.log(form, 111)
				let res = await initiate(form)
				this.$refs.uToast.show({
					message: '提现成功,等待审核！',
					type: 'success',
					duration: 1500
				})
				this.price = ''
				this.getMoney()
			},
			async getConfig() {
				let res = await getConfig()
				this.config = res.data
				console.log(this.config, 1111)
			},
			amountCer(val) {
				var reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;
				// let reg = / (([1-9]{1}\d*)(.\d{1,2})?)|(0{1}.\d{1,2})/
				if (reg.test(val)) {
					// console.log(true)
					return true;
				} else {
					// console.log(false)
					return false;
				};
			},
		},
	}
</script>

<style lang="scss">
	.withDraw {
		display: flex;
		flex-direction: column;
		padding: 20rpx;
		font-size: 28rpx;

		.withContent {
			padding: 20rpx;
			background: #fff;
			border-radius: 10rpx;
			box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
			padding-bottom: 40rpx;

			.botBtn {
				margin-top: 250rpx;
			}
		}

		.money {
			margin-top: 20px;
			color: #828282;
		}

		.item {
			display: flex;
			justify-content: space-between;
			margin-top: 20rpx;
			color: #828282;

			.jeNum {
				color: #2CB9A4;
			}

			.u-demo-block {
				display: flex;
				align-items: center;
				width: 100%;

				.u-demo-block__title {
					margin-right: 20rpx;
					width: 150rpx;
				}

				.u-demo-block__content {
					flex: 1;
				}
			}

		}
	}
</style>